<template>
  <el-form-item :label="nick">
    <el-select @change="sendName"  placeholder="请输入关键字搜索" v-model="companyName" filterable clearable>
      <el-option
        v-for="(item,index) in allCompanyFilterData"
        :key="item.id"
        :label="item.name"
        :value="index"
      ></el-option>
    </el-select>
  </el-form-item>
</template>

<script>
  import Http from '../libs/http.js'
  export default {
    name: 'DeptSelect',
    data () {
      return {
        nick:this.labelName,
        companyName:this.p_name,
        allCompany: [],
        selected:[],
        allCompanyFilterData: []
      }
    },
    props:["p_value","p_name","labelName"],
    created(){
      this.getall();
    },
    watch:{
      p_name(v){
        this.companyName =v ;
      }
    },
    methods:{
      dataFilter(val){
        if(val){
          this.allCompanyFilterData = this.allCompany.filter((item)=>{
            if(pinyinUtil.getFirstLetter(item.name).indexOf(val.toUpperCase())!=-1){
              return true
            }
          })
        }else{
          this.allCompanyFilterData = this.allCompany;
        }
      },
      sendName(index){
        let item = this.allCompanyFilterData[index];
        if(item){
          this.$emit('update:p_value',item.id);
          this.$emit('update:p_name',item.name);
          this.$emit("sendName",item.id);
        }else{
          this.$emit('update:p_value','');
          this.$emit('update:p_name','');
          this.$emit("sendName",'');
        }
      },
      getall(){
        Http.api.get("user/dept/all").then((res)=>{
          this.allCompany = res.data;
          this.allCompanyFilterData = this.allCompany;

        })
      }
    }
  }
</script>

